<template>
  <div class="currentPage">
    <topCard></topCard>
    <div class="main-content">
      <dataInfo></dataInfo>
      <functionList @changeInfo="confirm"></functionList>
      <div style="margin: 20px" v-if="isLogin">
        <van-button round block native-type="submit" color="linear-gradient(90deg, #218CC9 0%, #2CB9A4 105%)"
          @click="exit">
          退出
        </van-button>
      </div>
    </div>
  </div>
</template>

<script setup>
import 'vant/es/dialog/style';
import { showConfirmDialog } from 'vant';
import { reactive, ref } from "vue";
import dataInfo from "./cpns/dataInfo.vue";
import functionList from "./cpns/functionList.vue";
import topCard from "./cpns/topCard.vue";
import { onMounted } from "vue";
import { getRegionservice } from "@/services";
import useMainStore from '@/stores/modules/main';
import { storeToRefs } from 'pinia';
import { getAssetURL } from "@/utils/load_assets.js"
const mainStore = useMainStore()
import useUserInfo from "@/stores/modules/userInfo";
const userStore = useUserInfo();
const { userInfo } = storeToRefs(mainStore)
let localInfo = localStorage.getItem('userinfo3')
let token = localInfo ? JSON.parse(localInfo).token : ''
let isLogin = ref(token)
const exit = () => {
  showConfirmDialog({
    title: '提示',
    confirmButtonColor: '#218CC9',
    message:
      `您确认退出登录吗？`,
  })
    .then(async () => {
      localStorage.removeItem('userinfo3')
      isLogin.value = ''
      mainStore.$reset()
      userStore.$reset()
    })
    .catch(() => {});
}
const clientHeight = ref(document.documentElement.clientHeight)
onMounted(async () => {
  if (token) {
    let res = await getRegionservice()
    mainStore.dataCounts.exchange_count = res.data.exchange_count//兑换记录
    mainStore.dataCounts.order_count = res.data.order_count //分销订单
    mainStore.dataCounts.money = res.data.money
  }
})
</script>

<style lang="less" scoped>
.currentPage {
  height: calc(100vh - 60px);
  background-color: #fff;
  overflow: auto;
  padding-bottom: 50px;

  .main-content {
    position: relative;
  }
}
</style>
